<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('初始多表格')" />
	<th:block th:include="include :: datetimepicker-css" />
	<style>
		.headerBox {
			margin-right: -15px;
			margin-left: -15px;
		}
		.input-time {
			width: 200px !important;
		}
		.labelBox {
			display: flex;
			align-items: center;
		}
		.labelBox select{
			height: 40px !important;
		}
	</style>
</head>
<body class="gray-bg">
<div class="container-div">
	<div class="headerBox">
		<div class="col-sm-12 search-collapse">
			<p class="select-title">根据条件导出业务报表</p>
			<form id="time-form">
				<div class="select-list">
					<ul>
						<li class="labelBox">
							<label>公司：</label>
							<select id="companyId" name="companyId" required class="form-control" th:with="type=${@dict.getType('company')}">
								<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictCode}" ></option>
							</select>
						</li>
						<li class="labelBox">
							<label>药剂的类别：</label>
							<select id="medicineCategory" name="medicineCategory" required class="form-control" th:with="type=${@dict.getType('medicine')}">
								<option th:each="dict : ${type}" th:text="${dict.dictValue}" th:value="${dict.dictValue}" ></option>
							</select>
						</li>
						<li class="select-time">
							<label>开始截至时间： </label>
							<input type="text" class="input-time" name="createTimeStart" id="createTimeStart" placeholder="开始时间" required>
							<span>-</span>
							<input type="text" class="input-time" name="createTimeEnd" id="createTimeEnd" placeholder="结束时间" required>
						</li>
						<li>
							<a class="btn btn-primary btn-rounded btn-sm" onclick="exportOrder()"><i class="fa fa-search"></i>&nbsp;导出</a>
							<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('time-form')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
						</li>
					</ul>
				</div>
			</form>
		</div>
	</div>

	<div class="row">
		<div class="col-sm-12 search-collapse">
			<p class="select-title">单据筛选</p>
			<form id="form1">
				<div class="select-list">
					<ul>
						<li>
							处理范围：<input type="text" name="processRange"/>
						</li>
						<li>
							处理对象：<input type="text" name="processObject"/>
						</li>
						<li>
							报检编号：<input type="text" name="inspectionNumber"/>
						</li>
						<li>
							操作人员：<input type="text" name="operator"/>
						</li>
						<li>
							现场负责人：<input type="text" name="siteLeader"/>
						</li>

						<li>
							<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search('form1', 'bootstrap-table1')"><i class="fa fa-search"></i>&nbsp;搜索</a>
							<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('form1', 'bootstrap-table1')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
						</li>
					</ul>
				</div>
			</form>
		</div>
		<div class="btn-group-sm" id="toolbar1" role="group">
			<a class="btn btn-success" onclick="options1()">
				<i class="fa fa-search"></i> options
			</a>
			<a class="btn btn-success" onclick="$.operate.addTab()">
				<i class="fa fa-plus"></i> 新增
			</a>
			<a class="btn btn-primary single disabled" onclick="$.operate.edit()">
				<i class="fa fa-edit"></i> 修改
			</a>
			<a class="btn btn-danger multiple disabled" onclick="$.operate.removeAll()">
				<i class="fa fa-remove"></i> 删除
			</a>
		</div>
		<div class="col-sm-12 select-table table-striped">
			<table id="bootstrap-table1"></table>
		</div>
	</div>
</div>

<div th:include="include :: footer"></div>
<th:block th:include="include :: datetimepicker-js" />
<script th:inline="javascript">
	var prefix = ctx + "demo/operate";
	var datas = [[${@dict.getType('sys_normal_disable')}]];

	$(function() {
		var options = {
			id: "bootstrap-table1",
			formId: 'form1',
			toolbar: "toolbar1",
			url: "/order/list",
			createUrl: "/demo/table/multi1",
			removeUrl: prefix + "/remove",
			updateUrl: prefix + "/edit/{id}",
			modalName: "单据",
			contentType: 'application/json; charset=utf-8',
			pageNumName: 'currentPage',
			ascName: 'asc',
			columns: [{
				checkbox: true
			},
				{
					field : 'id',
					title : 'id'
				},
				{
					field : 'companyName',
					title : '公司名'
				},
				{
					field : 'number',
					title : '编号'
				},
				{
					field : 'applicationUnit',
					title : '申请单位'
				},
				{
					field : 'inspectionNumber',
					title : '报检编号'
				},
				{
					field : 'processObject',
					title : '处理对象'
				},
				{
					field : 'processSites',
					title : '处理地点'
				},
				{
					field : 'processRange',
					title : '处理范围'
				},
				{
					field : 'processNumber',
					title : '处理编号'
				},
				{
					field : 'processMethod',
					title : '处理方式'
				},
				{
					field : 'totalMedication',
					title : '用药总量'
				},
				{
					field : 'processTime',
					title : '处理时间'
				},
				{
					field : 'temperature',
					title : '温度'
				},
				{
					field : 'humidity',
					title : '湿度'
				},
				{
					field : 'windSpeed',
					title : '风速'
				},
				{
					field : 'applicationStartTime',
					title : '施药开始时间'
				},
				{
					field : 'applicationEndTime',
					title : '施药结束时间'
				},
				{
					field : 'diffuseStartTime',
					title : '散气开始时间'
				},
				{
					field : 'diffuseEndTime',
					title : '散气结束时间'
				},
				{
					field : 'siteLeader',
					title : '现场负责人'
				},
				{
					field : 'operator',
					title : '操作人员'
				},
				{
					field : 'amount',
					title : '金额'
				},
				{
					field : 'area',
					title : '面积'
				},
				{
					field : 'volume',
					title : '体积'
				},
				{
					field : 'additionalBatcheNumber',
					title : '额外批次数量'
				},
				{
					field : 'remark',
					title : '备注'
				},
				{
					title: '操作',
					align: 'center',
					formatter: function(value, row, index) {
						var actions = [];
						actions.push('<a class="btn btn-success btn-xs" href="javascript:void(0)"><i class="fa fa-edit"></i>打印</a> ');
						actions.push('<a class="btn btn-info btn-xs href="javascript:void(0)" onclick="showDetail(\'' + row.id + '\')"><i class="fa fa-key"></i>预览</a>');
						return actions.join('');
					}
				}]
		};
		$.table.init(options);

		$("#createTimeStart").datetimepicker({
			format: "yyyy-mm-dd hh:ii:ss",
			autoclose: true
		});
		$("#createTimeEnd").datetimepicker({
			format: "yyyy-mm-dd hh:ii:ss",
			autoclose: true
		});
	});

	function showDetail(id){
		$.get('/order/getById?id='+id, (res) => {
			console.log(res)
		});
	}

	function options1() {
		var temp = "";
		var obj = table.config['bootstrap-table1'];
		for (var i in obj) {
			temp += i + ":" + obj[i] + "<br/>";
		}
		$.modal.alert(temp);
	}

	function exportOrder() {
		if ($.validate.form('time-form')) {
			var data = $("#time-form").serializeArray();
			let query = '';
			data.forEach((item, index) => {
				query += (item.name + "=" + item.value);
				if (data.length != index + 1) {
					query += "&"
				}
			});
			window.open('/order/getDisinfectionStatisticsReport?' + query);
		}
	}

</script>
</body>
</html>